﻿@inject IJSRuntime JS

@if (Outline)
{
    @ChildContent
}
else
{
    <div class="@($"magazine-layout magazine-style {Class}")" id="@LayoutId" @onkeydown="OnKeyDown" tabindex="-1" autofocus="auto">
        @ChildContent
    </div>
}

@code {
    [Parameter]
    public RenderFragment ChildContent { get; set; }
    [Parameter]
    public EventCallback<KeyboardEventArgs> OnKeyDown { get; set; }
    [Parameter]
    [EditorRequired]
    public string LayoutId { get; set; }
    [Parameter]
    public string Class { get; set; }
    [Parameter]
    public bool Outline { get; set; }


    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender && !Outline)
        {
            await JS.InvokeVoidAsync("focusOnElement", LayoutId);
        }
    }

}
